/**
 * 这里是uni-app内置的常用样式变量
 *
 * uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
 * 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
 *
 */

/**
 * 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
 *
 * 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
 */

/* 颜色变量 */
$fu-prefix: fu;

/* 行为相关颜色 */
$uni-color-primary: #007aff;
$uni-color-success: #4cd964;
$uni-color-warning: #f0ad4e;
$uni-color-error: #dd524d;

/* 文字基本颜色 */
$uni-text-color:#333;//基本色
$uni-text-color-inverse:#fff;//反色
$uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息
$uni-text-color-placeholder: #808080;
$uni-text-color-disable:#c0c0c0;

/* 背景颜色 */
$uni-bg-color:#ffffff;
$uni-bg-color-grey:#f8f8f8;
$uni-bg-color-hover:#f1f1f1;//点击状态颜色
$uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色

/* 边框颜色 */
$uni-border-color:#c8c7cc;

/* 尺寸变量 */

/* 文字尺寸 */
$uni-font-size-sm:12px;
$uni-font-size-base:14px;
$uni-font-size-lg:16;

/* 图片尺寸 */
$uni-img-size-sm:20px;
$uni-img-size-base:26px;
$uni-img-size-lg:40px;

/* Border Radius */
$uni-border-radius-sm: 2px;
$uni-border-radius-base: 3px;
$uni-border-radius-lg: 6px;
$uni-border-radius-circle: 50%;

/* 水平间距 */
$uni-spacing-row-sm: 5px;
$uni-spacing-row-base: 10px;
$uni-spacing-row-lg: 15px;

/* 垂直间距 */
$uni-spacing-col-sm: 4px;
$uni-spacing-col-base: 8px;
$uni-spacing-col-lg: 12px;

/* 透明度 */
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度

/* 文章场景相关 */
$uni-color-title: #2C405A; // 文章标题颜色
$uni-font-size-title:20px;
$uni-color-subtitle: #555555; // 二级标题颜色
$uni-font-size-subtitle:26px;
$uni-color-paragraph: #3F536E; // 文章段落颜色
$uni-font-size-paragraph:15px;

.color-gray {
	color: gray;
}
.text-center {
	text-align: center;
}
.flex {
	display: flex;
}
.flex-1 {
	flex: 1;
}
.flex-column {
	flex-direction: column;
}
.align-center {
	align-items: center;
}
.justify-center {
	justify-content: center;
}
.align-start {
	align-items: flex-start;
}
.align-end {
	align-items: flex-end;
}
.text-666 {
	color: #666;
}
.cu-bar .search-form {
  background-color: #f5f5f5;
  line-height: 64upx;
  height: 64upx;
  font-size: 24upx;
  color: #333333;
  flex: 1;
  display: flex;
  align-items: center;
  margin: 0 30upx;
}
.cu-bar .search-form+.action {
  margin-right: 30upx;
}

.cu-bar .search-form input {
  flex: 1;
  padding-right: 30upx;
  height: 64upx;
  line-height: 64upx;
  font-size: 26upx;
  background-color: transparent;
}

.cu-bar .search-form [class*="cuIcon-"] {
  margin: 0 0.5em 0 0.8em;
}

.cu-bar .search-form [class*="cuIcon-"]::before {
  top: 0upx;
}
.text-ellipsis {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}
.text-bold {
  font-weight: bold;
}

input {
	border: none;
}

.flex-wrap {
	flex-wrap: wrap;
}
.justify-start {
	justify-content: start;
}
.justify-between {
	justify-content: space-between;
}
.border-b-c9 {
	border-bottom: 1rpx solid #c9c9c9;
}
.border-b-f7 {
	border-bottom: 1rpx solid #f7f7f7;
}
.padding-tb-32 {
	padding-top: 32rpx !important;
	padding-bottom: 32rpx !important;
}
.padding-lr-32 {
	padding-left: 32rpx !important;
	padding-right: 32rpx !important;
}
.padding-tb-24 {
	padding-top: 24rpx !important;
	padding-bottom: 24rpx !important;
}
.padding-lr-24 {
	padding-left: 24rpx !important;
	padding-right: 24rpx !important;
}
.padding-tb-16 {
	padding-top: 16rpx !important;
	padding-bottom: 16rpx !important;
}
.padding-lr-16 {
	padding-left: 16rpx !important;
	padding-right: 16rpx !important;
}
.padding-tb-12 {
	padding-top: 12rpx !important;
	padding-bottom: 12rpx !important;
}
.padding-tb-10 {
	padding-top: 10rpx !important;
	padding-bottom: 10rpx !important;
}
.padding-tb-8 {
	padding-top: 8rpx !important;
	padding-bottom: 8rpx !important;
}
.padding-lr-12 {
	padding-left: 12rpx !important;
	padding-right: 12rpx !important;
}
.padding-b-16 {
	padding-bottom: 16rpx;
}
.padding-b-24 {
	padding-bottom: 24rpx;
}
.padding-12 {
	padding: 12rpx;
}
.padding-16 {
	padding: 16rpx;
}
.padding-24 {
	padding: 24rpx;
}
.padding-32 {
	padding: 32rpx;
}
.margin-t-24 {
	margin-top: 24rpx;
}
.margin-t-32 {
	margin-top: 32rpx;
}
.margin-t-48 {
	margin-top: 48rpx;
}
.flex-shrink {
	flex-shrink: 0;
}
.over-hidden {
	overflow: hidden;
}
.fs-24 {
	font-size: 24rpx;
}
.fs-26 {
	font-size: 26rpx;
}
.fs-28 {
	font-size: 28rpx;
}
.fs-30 {
	font-size: 30rpx;
}
.fs-32 {
	font-size: 32rpx;
}
.fs-34 {
	font-size: 34rpx;
}
.fs-36 {
	font-size: 36rpx;
}
.color-c {
	color: #ccc;
}
.margin-r-24 {
	margin-right: 24rpx;
}
.margin-r-12 {
	margin-right: 12rpx;
}
.margin-r-16 {
	margin-right: 16rpx;
}
.margin-l-24 {
	margin-left: 24rpx;
}
.margin-l-12 {
	margin-left: 12rpx;
}
.margin-t-12 {
	margin-top: 12rpx;
}
.margin-t-10 {
	margin-top: 10rpx;
}
.margin-t-8 {
	margin-top: 8rpx;
}
.margin-t-20 {
	margin-top: 20rpx;
}
.margin-t-16 {
	margin-top: 16rpx;
}
.margin-t-18 {
	margin-top: 18rpx;
}
.margin-t-24 {
	margin-top: 24rpx;
}
.margin-t-26 {
	margin-top: 26rpx;
}
.margin-t-28 {
	margin-top: 28rpx;
}
.margin-t-30 {
	margin-top: 30rpx;
}
.margin-t-32 {
	margin-top: 32rpx;
}
.margin-b-12 {
	margin-bottom: 12rpx;
}
.margin-b-16 {
	margin-bottom: 16rpx;
}
.margin-b-18 {
	margin-bottom: 18rpx;
}
.margin-b-20 {
	margin-bottom: 20rpx;
}
.margin-b-24 {
	margin-bottom: 24rpx;
}
.margin-b-26 {
	margin-bottom: 26rpx;
}
.margin-b-28 {
	margin-bottom: 28rpx;
}
.margin-b-30 {
	margin-bottom: 30rpx;
}
.margin-b-32 {
	margin-bottom: 32rpx;
}
.margin-b-10 {
	margin-bottom: 10rpx;
}
.margin-lr-24 {
	margin-left: 24rpx;
	margin-right: 24rpx;
}
.margin-lr-12 {
	margin-left: 12rpx;
	margin-right: 12rpx;
}
.margin-lr-32 {
	margin-left: 32rpx;
	margin-right: 32rpx;
}
.bg-f {
	background-color: #fff;
}
.color-a {
	color: #aaa;
}
.color-9 {
	color: #999;
}
.color-85 {
	color: #858585;
}
.text-underline {
	text-decoration: underline;
}
.border-b-b4 {
	border-bottom: 1rpx solid #b4b4b4;
}
.border-b-e4 {
	border-bottom: 1rpx solid #e4e4e4;
}

.text-cut-2,
.text-cut-3,
.text-cut-4,
.text-cut-5 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-all;
}
.text-cut-2 {
    -webkit-line-clamp: 2;
}

.text-cut-3 {
    -webkit-line-clamp: 3;
}

.text-cut-4 {
    -webkit-line-clamp: 4;
}

.text-cut-5 {
    -webkit-line-clamp: 5;
}

.record-layer {
	display: none;
}
.record-layer1 {
	width: 100vw;
	// padding: 300px 0;
	box-sizing: border-box;
	height: 100vh;
	position: fixed;
	background-color: rgba(0, 0, 0, .6);
	z-index: 101;
	bottom: 0vh;
	left: 0;
	display: flex;
	align-items: flex-end;
}
.record-box {
	width: 100%;
	position: relative;
}

.record-box1 {
	width: 100%;
	position: relative;
	// bottom: -83vh;
	height: 17vh;
}
.record-btn-layer {
		width: 100%;
	}

	.record-btn-layer button::after {
		border: none;
		transition: all 0.1s;
	}

	.record-btn-layer button {
		font-size: 14px;
		line-height: 50px;
		width: 100%;
		height: 50px;
		border-radius: 8px;
		text-align: center;
		background: #FFD300;
		transition: all 0.1s;
	}

	.record-btn-layer button image {
		width: 16px;
		height: 16px;
		margin-right: 4px;
		vertical-align: middle;
		transition: all 0.3s;
	}

	.record-btn-layer .record-btn-1 {
		background-image: linear-gradient(to right, #43e97b 0%, #38f9d7 100%);
		color: #000000 !important;

	}

	.record-btn-layer .record-btn-2 {
		border-radius: 168rpx 168rpx 0 0;
		height: 17vh;
		line-height: 17vh;
		transition: all 0.3s;
	}
	/* 提示小弹窗 */
	.prompt-layer {
		border-radius: 15px;
		background: #95EB6C;
		padding: 8px 16px;
		box-sizing: border-box;
		position: absolute;
		left: 50%;
		height: 11vh;
		transform: translateX(-50%);
		transition: all 0.3s;
	}
	
	.prompt-layer::after {
		content: '';
		display: block;
		border: 12px solid rgba(0, 0, 0, 0);
		border-radius: 10rpx;
		border-top-color: #95EB6C;
		position: absolute;
		bottom: -46rpx;
		left: 50%;
		transform: translateX(-50%);
		transition: all 0.3s;
	}
	
	//取消动画
	.prompt-layer1 {
		border-radius: 15px;
		background: #FB5353;
		padding: 8px 16px;
		box-sizing: border-box;
		position: absolute;
		left: 50%;
		height: 11vh;
		transform: translateX(-50%);
		transition: all 0.3s;
	}
	
	.prompt-layer1::after {
		content: '';
		display: block;
		border: 12px solid rgba(0, 0, 0, 0);
		border-radius: 10rpx;
		border-top-color: #FB5353;
		position: absolute;
		bottom: -46rpx;
		left: 50%;
		transform: translateX(-50%);
		transition: all 0.3s;
	}
	
	.prompt-layer-1 {
		font-size: 12px;
		width: 150px;
		text-align: center;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		top: -400rpx;
	}
	
	.prompt-layer-1 .p {
		color: #000000;
	}
	
	.prompt-layer-1 .span {
		color: rgba(0, 0, 0, .6);
	}
	
	.prompt-loader .em {}
	
	/* 语音音阶------------- */
	.prompt-loader {
		width: 110px;
		height: 20px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		// margin-bottom: 6px;
	}
	
	.prompt-loader .em {
		display: block;
		background: #0FBA75;
		width: 2px;
		height: 10%;
		margin-right: 2.5px;
		float: left;
	}
	
	.prompt-loader .em:last-child {
		margin-right: 0px;
	}
	
	.prompt-loader .em:nth-child(1) {
		animation: load 2.5s 1.4s infinite linear;
	}
	
	.prompt-loader .em:nth-child(2) {
		animation: load 2.5s 1.2s infinite linear;
	}
	
	.prompt-loader .em:nth-child(3) {
		animation: load 2.5s 1s infinite linear;
	}
	
	.prompt-loader .em:nth-child(4) {
		animation: load 2.5s 0.8s infinite linear;
	}
	
	.prompt-loader .em:nth-child(5) {
		animation: load 2.5s 0.6s infinite linear;
	}
	
	.prompt-loader .em:nth-child(6) {
		animation: load 2.5s 0.4s infinite linear;
	}
	
	.prompt-loader .em:nth-child(7) {
		animation: load 2.5s 0.2s infinite linear;
	}
	
	.prompt-loader .em:nth-child(8) {
		animation: load 2.5s 0s infinite linear;
	}
	
	.prompt-loader .em:nth-child(9) {
		animation: load 2.5s 0.2s infinite linear;
	}
	
	.prompt-loader .em:nth-child(10) {
		animation: load 2.5s 0.4s infinite linear;
	}
	
	.prompt-loader .em:nth-child(11) {
		animation: load 2.5s 0.6s infinite linear;
	}
	
	.prompt-loader .em:nth-child(12) {
		animation: load 2.5s 0.8s infinite linear;
	}
	
	.prompt-loader .em:nth-child(13) {
		animation: load 2.5s 1s infinite linear;
	}
	
	.prompt-loader .em:nth-child(14) {
		animation: load 2.5s 1.2s infinite linear;
	}
	
	.prompt-loader .em:nth-child(15) {
		animation: load 2.5s 1.4s infinite linear;
	}
	@keyframes load {
		0% {
			height: 10%;
		}
	
		50% {
			height: 100%;
		}
	
		100% {
			height: 10%;
		}
	}
	
	.prompt-loader .em.pause {
		animation-play-state: paused;
	}
	
	/* 语音音阶-------------------- */
	.prompt-layer-2 {
		top: -40px;
	}
	
	.prompt-layer-2 .text {
		color: rgba(0, 0, 0, 1);
		font-size: 12px;
	}
